<div class="layui-form layui-form-pane" style="padding: 20px;">
    <div class="layui-form-item">
        <label class="layui-form-label">标题</label>
        <div class="layui-input-block">
            <input type="text" class="layui-input" name="title" autocomplete="off">
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">详情</label>
        <div class="layui-input-block">
            <textarea name="detail" placeholder="请输入内容" class="layui-textarea"></textarea>
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">封面</label>
        <div class="layui-upload-drag" id="upload" style="width:298px;">
            <input type="hidden" name="cover">
            <p id="preview">点击上传，或将文件拖拽到此处</p>
        </div>
    </div>

    <div class="layui-form-item">
        <button id="add" class="layui-btn layui-btn-fluid layui-bg-cyan">提交</button>
    </div>
</div>

<script>
    layui.use('upload', function(){
        var upload = layui.upload;
        upload.render({
            elem: '#upload',
            url: '/handler/upload/uploadImage',
            accept: 'images',
            exts: 'jpg|png|gif|bmp|jpeg',
            done: function(res){
                if(res.ret == 1){
                    $('input[name=cover]').val(res.url);
                    $('#preview').html('<image src="'+res.url+'" style="width:50px;height:50px;" />');
                }
                layer.msg(res.msg);
            }
        });
    });
</script>